<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>学习管理</title>
  <link rel="stylesheet" href="./../../static/student/css/style.css">
  <script defer src="./../../static/student/js/learning-management.js"></script>
</head>
<body>
  <!-- 顶部导航栏 -->
  <header class="navbar">
    <div class="logo">Student Panel</div>
    <h1>学习管理</h1>
    <div class="user-info">
      <img src="student-avatar.jpg" alt="Student Avatar" class="avatar">
      <button class="logout-btn" id="logout-btn">退出</button>
    </div>
  </header>

  <!-- 侧边导航栏 -->
  <aside class="sidebar">
    <ul>
      <li><a href="student-home.html">首页</a></li>
      <li><a href="learning-management.html">学习管理</a></li> <!-- 当前页面 -->
      <li><a href="S-attendance-management.html">点名管理</a></li>
    </ul>
  </aside>

  <!-- 主内容区域 -->
  <main>
    <!-- 我的课程列表 -->
    <section class="learning-units">
      <h2>我的学习单元</h2>

      <!-- 课程表格 -->
      <table id="course-table" class="course-table">
        <thead>
          <tr>
            <th>课程名称</th>
            <th>学习进度</th>
            <th>学习单元</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>
          <!-- JavaScript will populate this -->
        </tbody>
      </table>
    </section>

    <!-- 作业管理 -->
    <section class="homework-section">
      <h2>我的作业</h2>
      <table id="homework-table" class="homework-table">
        <thead>
          <tr>
            <th>作业名称</th>
            <th>截止日期</th>
            <th>状态</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>
          <!-- JavaScript will populate this -->
        </tbody>
      </table>
    </section>

    <!-- 成绩显示 -->
    <section class="grades-section">
      <h2>我的成绩</h2>
      <table id="grades-table" class="grades-table">
        <thead>
          <tr>
            <th>课程名称</th>
            <th>成绩</th>
          </tr>
        </thead>
        <tbody>
          <!-- JavaScript will populate this -->
        </tbody>
      </table>
    </section>
  </main>

  <!-- 底部信息 -->
  <footer class="footer">
    <p>© 2024 Student Panel, All Rights Reserved</p>
    <a href="/help">帮助</a> | <a href="/contact">联系我们</a>
  </footer>
</body>
</html>

